<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="https://ss1.bdstatic.com/5eN1bjq8AAUYm2zgoY3K/r/www/cache/static/protocol/https/jquery/jquery-1.10.2.min_65682a2.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script src="https://raw.githubusercontent.com/Tencent/vConsole/dev/dist/vconsole.min.js"></script>
    <script>

        var vConsole = new VConsole();
    </script>
</head>
<body>

<button onclick="chuantu()">上传图片</button>

<script>
    $(function(){
        $.get("find_config",{url:
                encodeURIComponent(location.href.split('#')[0])},function(data){
            wx.config({
                debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId:data.appId, // 必填，公众号的唯一标识
                timestamp:data.timestamp.substring(10) , // 必填，生成签名的时间戳
                nonceStr: data.nonceStr.substring(9), // 必填，生成签名的随机串
                signature: data.signature.toLowerCase(),// 必填，签名
                jsApiList: ['chooseImage'] // 必填，需要使用的JS接口列表
            });

            wx.error(function(res){});
        });

        wx.ready(function(){

        });
    });

    function chuantu(){
        wx.chooseImage({
            count: 5, // 默认9
            sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
            sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
            success: function (res) {
                var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                wx.getLocalImgData({
                    localId: localIds[0], // 图片的localID
                    success: function (res) {
                        var localData = res.localData; // localData是图片的base64数据，可以用img标签显示
                        console.log(localData);
                    }
                });
            }
        });
    }
</script>


</body>
</html>
